<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我的团队</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css">
    <link rel="stylesheet" type="text/css" href="../css/aui-slide.css">
    <link rel="stylesheet" type="text/css" href="../css/center.css">
    <link rel="stylesheet" type="text/css" href="../css/common.css">
    <style media="screen">
      .agency {border-bottom: 1px solid ##EEEEEE;}
      .agency span{flex:8;-webkit-flex:8;color:#666666;}
      .agency img{width:1rem;margin-right: 0.3rem;}
      .content_info{text-align: center;}
      .content_info img{display: inline-block;width:3.2rem;height: 3.2rem;border-radius: 3.2rem;margin: 0.5rem 0 0;}
      .content_info .name{color: #333333;font-size: 0.7rem;}
      .content_info .phone{color:#999999;}
      .team_listcon2{border-color: #FE417A}
      .team_listcon p{color:#333333;font-size: 0.8rem;}
      .team_num .aui-grid-label{color:#666666;font-size: 0.7rem;}
      .team_num [class*="aui-col-"]{padding: 0}
      .search{position: relative;}
      .search i{position: absolute;color: #999999;right: 0.75rem;top:0.25rem;}
      .search input{background: #EEEEEE;height: 1.4rem;border-radius: 1.4rem;padding: 0 0.5rem;font-size: 0.6rem;color: #CCCCCC;}
      .search input::-webkit-input-placeholder {color:#CCCCCC}
      .search input:-moz-placeholder { color:#CCCCCC;}
      .search input::-moz-placeholder {color:#CCCCCC;}
      .search input:-ms-input-placeholder {color:#CCCCCC;}
      .aui-content-padded{border-radius: 0.3rem;overflow: hidden;}
      .search_list .img{width: 3rem;}
      .search_list .n_info{border-left: 1px solid #EEEEEE;padding-left: 0.5rem;}
      .search_list .n_info dt,.search_list .n_info dd{color: #999999;font-size: 0.6rem;display: inline-block;}
      .search_list .n_info dd{margin-left: 0.1rem;}
      .search_list .x_info{flex:8;padding: 0 0.5rem;}
      .search_list .x_info h5{color: #333333;font-size: 0.7rem}
      .search_list .x_info h5 span{display: inline-block;padding:0rem 0.3rem;background: #FE417A;color: white;border-radius: 3rem;font-size: 0.6rem;}
      .search_list .x_info img{float: left;width: 0.8rem;margin-right: 0.1rem;margin-top: 0.1rem;}
      .search_list .x_info p{color: #999999}
      .c_list{text-align: center;}
      .c_list .aui-col-xs-4{padding: 0.5rem 0;color: #666666}
      .c_list .c_c{color: #FE417A}
      .list_box{border-radius: 0.3rem;margin-bottom: 0.4rem;background: white;}
    </style>
</head>
<body>
  <!-- 你的推荐人 -->
<section class="aui-content-padded aui-card-list list_s" style="height:9rem;">
  <div class="aui-grid">
    <div class="aui-card-list-header agency">
      <img  src="../image/newImg/ndtjr.png" alt="">
      <span>你的推荐人</span>
      <i></i>
    </div>
    <div class="aui-content content_info">
      <div class="imgHead" id="pheadimgurl"><img src="../image/newImg/tjr_img.png" alt=""></div>
      <div class="name" id="pname"></div>
      <div class="phone" id="pmobile">---</div>
    </div>
  </div>
</section>
<!-- 信息列表 -->
<section class="aui-content-padded info_list" style="background:white;">
  <div class="team_topcon">
     <div class="team_toplist">
        <div class="team_listcon team_listcon2">
          <p>总人数</p>
          <p><span id="total">0</span>人</p>
        </div>
     </div>
     <div class="team_toplist">
        <div class="team_listcon team_listcon2">
          <p>直属粉丝</p>
          <p><span id="fans1_1">0</span>人</p>
        </div>
     </div>
  </div>
  <section class="aui-grid team_num">
    <div class="aui-row" style="border-top:1px solid #EEEEEE;padding:0.6rem 0;">
       <div class="aui-col-xs-3" style="border-right:1px solid #EEEEEE">
           <div class="aui-grid-label"><span id="today_add">0</span>人</div>
           <div class="aui-grid-label">今日新增</div>
       </div>
       <div class="aui-col-xs-3" style="border-right:1px solid #EEEEEE">
           <div class="aui-grid-label"><span id="yesterday_add">0</span>人</div>
           <div class="aui-grid-label">昨日增加</div>
       </div>
       <div class="aui-col-xs-3" style="border-right:1px solid #EEEEEE">
           <div class="aui-grid-label"><span id="fans1_2">0</span>人</div>
           <div class="aui-grid-label">直属<span class="lv0_name">珍粉</span></div>
       </div>
       <div class="aui-col-xs-3">
           <div class="aui-grid-label"><span id="fans2_1">0</span>人</div>
           <div class="aui-grid-label">直属粉丝下级</div>
       </div>
    </div>
  </section>
</section>
<!-- 搜索 -->
<section class="aui-content-padded search_box" style="background:white;padding: 0.75rem;">
  <div class="search"><input type="search" value="" placeholder="请输入手机号查询" id="m"><i class="aui-iconfont aui-icon-search" onclick="getList()" tapmode></i></div>
</section>
<!-- 列表  -->
<section class="aui-content-padded search_list" id="list">


</section>

</body>
<script type="text/javascript" src="../script/api.js" ></script>
<script type="text/javascript" src="../script/zepto.min.js" ></script>
<script type="text/javascript" src="../script/doT.min.js" ></script>
<script type="text/javascript" src="../script/common.js" ></script>
<script type="text/javascript">
    var p=0;
    apiready = function(){
        api.parseTapmode();
        //流动监听
        api.addEventListener({
            name:'scrolltobottom',
            extra:{
                threshold:100 //设置距离底部多少距离时触发，默认值为0，数字类型
            }
        }, function(ret, err){
            getList();
        });
        getData();
        getList();
        //监听回车
        document.onkeydown = function (event) {
          var e = event || window.event;
          if (e && e.keyCode == 13) { //回车键的键值为13
              getList();
          }
      };
    }
    function getData(){
        _loading2();
        _Ajax(window.APIServer.Team,'post',{values:{}},'json',function(ret){
            _loading2_close();
            //.渲染页面
            if (ret.code==1) {
              if (ret.data.pheadimgurl!='') {
                  $('#pheadimgurl img').attr('src',ret.data.pheadimgurl);
              }
              $('#total').html(ret.data.total);
              $('#today_add').html(ret.data.today_add);
              $('#yesterday_add').html(ret.data.yesterday_add);
              $('#pname').html(ret.data.pname);
              $('#pmobile').html(ret.data.pmobile);
              $('#fans1_1').html(ret.data.fans1_1);
              $('#fans2_1').html(ret.data.fans2_1);
              $('#fans1_2').html(ret.data.fans1_2);
              $('.lv0_name').html(ret.data.lv0_name);
            }else{
              _toast(ret.msg)
            }

        })
    }
    function getList(){
        p++;
        _loading2();
        var m = $('#m').val();
        _Ajax(window.APIServer.TeamList,'post',{values:{p:p,m:m}},'json',function(ret){
            _loading2_close();
            if (m!='') {
              $('#list').html('');
            }
            //.渲染页面
            if (ret.code==1) {
                var evalText = doT.template($api.text($api.byId('goodslist')));
                $api.append($api.byId('list'), evalText(ret));
                imageCache('.goods_img');
            }else{
                p--;
                $('.loading-1').remove();
                $('#list').append('<div class="loading-1">'+ret.msg+'</div>');
            }

        })
    }
</script>
<script id="goodslist" type="text/x-dot-template">
    {{ for (key in it.data){ }}
    <div class="list_box">
      <div class="aui-card-list-header" style="border-bottom:1px solid #EEEEEE">
        <div class="imgHead">
          {{? it['data'][key]['headimgurl']!='' }}
            <img src="../image/newImg/s_img.png" _src="{{= it['data'][key]['headimgurl'] }}" class="goods_img">
          {{??}}
            <img src="../image/newImg/s_img.png">
          {{?}}
        </div>
        <div class="x_info">
          <h5>{{= it['data'][key]['nickname'] }} <span>{{= it['data'][key]['leval'] }}</span></h5>
          <p><img src="../image/newImg/time.png" alt="">{{= it['data'][key]['create_time'] }}</p>
        </div>
        <div class="n_info">
          <dl><dt>推荐人数</dt><dd>{{= it['data'][key]['fans'] }}</dd></dl>
          <dl><dt>订单数量</dt><dd>{{= it['data'][key]['orders'] }}</dd></dl>
        </div>
      </div>
      <div class="aui-row c_list">
         <div class="aui-col-xs-4">
            <div class="aui-grid-label">今日新增</div>
            <div class="aui-grid-label c_c">{{= it['data'][key]['today_add'] }}</div>
         </div>
         <div class="aui-col-xs-4">
           <div class="aui-grid-label">本月预估</div>
           <div class="aui-grid-label c_c">{{= it['data'][key]['month_yg'] }}</div>
         </div>
         <div class="aui-col-xs-4">
           <div class="aui-grid-label">今日预估</div>
           <div class="aui-grid-label c_c">{{= it['data'][key]['today_yg'] }}</div>
         </div>
      </div>
    </div>

    {{ } }}
</script>
</html>
